<template>
  <div id="app" v-cloak>
    <router-view></router-view>
  </div>
</template>
<script>
import { onMounted, reactive } from "vue";
import { useStore } from "vuex";
import { useRoute } from "vue-router";
export default {
  setup() {
    const store = useStore();
    const route=useRoute();

    onMounted(() => {
      //预渲染
      document.dispatchEvent(new Event("render-event"));

      //在页面加载时读取sessionStorage里的状态信息
      if (sessionStorage.getItem("store")) {
        store.replaceState(
          Object.assign(
            {},
            store.state,
            JSON.parse(sessionStorage.getItem("store"))
          )
        );
      }
      //在页面刷新时将vuex里的信息保存到sessionStorage里
      window.addEventListener("beforeunload", () => {
        sessionStorage.setItem("store", JSON.stringify(store.state));
      });
    });
  },
};
</script>
<style lang="less">
@import "./assets/css/public.css";


</style>
